<template>
    <div class="poster h-full" v-bind="$attrs">
        <div v-if="loading" class="h-full flex align-center">
            <a-spin/>
        </div>
        <template v-else>
            <img :src="posterUrl" class="h-full" v-if="posterUrl">
        </template>
    </div>
</template>

<script setup>
    import { ref } from 'vue'
    import { useRequest } from '@/hooks/loading'
    import apiRequest from '@/common/utils/request'
    import store from '@/store'

    const { loading, request } = useRequest(true)
    const posterUrl = ref('')
    const emits = defineEmits(['error'])

    store.dispatch('GetConfigInfo').then(config => {
        request(apiRequest.post('/work_ai', '/distribution/poster', {
            default_avatar: config.basic.system_square_logo,
            default_nickname: 'GPT机器人'
        })).then(res => {
            posterUrl.value = res.url
        }).catch(err => {
            emits('error', err)
        })
    })

</script>

<style lang="less" scoped>
</style>